<div class="chatUtils" xmlns:v-bind="http://www.w3.org/1999/xhtml">
    <div class="chatIcon">
        <span class='showAll'><i class="fa fa-address-card"></i></span>
        <span class='showPerson'><i class="fa fa-list-alt"></i></span>
        <span class='searchKeyword'><i class="fa fa-search"></i></span>
    </div>
    <div class="hisMain hisAll" id='chatUtils_hisPAllDiv'>
        <div class="hisTip">
            <div class="title_wrap" id="chatUtils_title"></div>
        </div>
        <div class="message_panel hisAllMsg"></div>
        <div class="page">
            <div class="msdn"><a href="#?page=2" class="prev"> 上一页</a> <a href="###" class="next">下一页 </a>

                <div class="search"><input type="date"></div>
            </div>
        </div>
    </div>
    <div class="hisMain hisPerson" id='chatUtils_hisPerDiv'>
        <div class='hisSearch'><p>搜索</p>

            <form id="searchForm">
                <div class='inputSearch'>
                    <lable for='charUtils_hisSearchForSession'>用户名称</lable>
                    <input id='charUtils_hisSearchForSession' type="text">
                </div>
                <div class='inputSearch'>
                    <lable for='charUtils_hisSearchForLong'>时长</lable>
                    <input id='charUtils_hisSearchForLong' style="width: 30%;" type="number">
                    <lable for='charUtils_hisSearchForLongEnd'> ~</lable>
                    <input id='charUtils_hisSearchForLongEnd' style="width: 30%;" type="number">
                </div>
                <div class='inputSearch'>
                    <lable for='charUtils_hisSearchForStartTime'>开始时间</lable>
                    <input id='charUtils_hisSearchForStartTime' type="date">
                </div>
                <div class='inputSearch'>
                    <lable for='charUtils_hisSearchForEndTime'>结束时间</lable>
                    <input id='charUtils_hisSearchForEndTime' type="date">
                </div>
            </form>
        </div>
        <div class="hisSearchBody">
            <div class="hisSearhSon"></div>
        </div>
    </div>
    <div class="hisMain searchKeyword" style="display: none" id='chatUtils_hiskeyWord'>
        <div class="searchInput">
            <select class="keySearch" id="chatUtils_client">
                <option value="">选择客户</option>
                <option v-for="value in users" v-if="(value.alias == '')" v-bind:value="value.id">{{value.alias || value.name}}</option>
            </select>
            <select class="keySearch"  id="chatUtils_agent">
                <option value="">选择坐席</option>
                <option v-for="value in users" v-if="(value.alias != '')" v-bind:value="value.id">{{value.alias || value.name}}</option>
            </select>
            <input type="search" placeholder="请输入搜索关键字" class="keySearch">
            <button type="submit" class="submit" @click="getSearchResult()"><i class="fa fa-search" >搜索</i></button>
        </div>
        <ul>
            <li>
                <span>会话ID</span><span>客户姓名</span><span>IRN</span><span>邮件地址</span><span>话务员姓名</span><span>日期</span><span>相关度</span>
            </li>
            <li v-for="searchResult in searchResultArr" v-on:click="showContent(searchResult.sessionId)">
                <span>{{searchResult.sessionId}}</span><span>{{searchResult.client.firstName}}</span><span>{{searchResult.client.irn}}</span><span>{{searchResult.agent.emailAddress}}</span><span>{{searchResult.agent.alias}}</span><span>{{searchResult.sessionDate}}</span><span>{{searchResult.relevance}}</span>
            </li>
        </ul>
    </div>
</div>